<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="品优购 品优购 品优购 品优购">
    <meta name="Keyword" content="网上购物，****">
    <title>列表页-手机页面</title>
    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
    <!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
    <![endif]-->
    <!-- 引入facicon.ico -->
    <link rel="shortcut icon" href="bitbug_favicon.ico">
    <!-- 引入字体文件 -->
    <link rel="stylesheet" href="fonts/css/font-awesome.min.css">
    <!-- 引入css初始化文件 -->
    <link rel="stylesheet" href="css/base.css">
    <!-- 引入公共样式 -->
    <link rel="stylesheet" href="css/common.css">
    <!-- 引入列表页样式 -->
    <link rel="stylesheet" href="css/list.css">
</head>
<body>
    <!-- 顶部快捷导航 start -->
    <div class="shortcut">
            <div class="container">
                <div class="fn-fl login">
                    <ul>
                        <li>品优购欢迎您！</li>
                        <li>
                        <a href="login.html">请登录</a>
                        <a href="register.html" class="style-red">免费注册</a>
                        </li>
                    </ul>
                </div>
                <div class="fn-fr">
                    <ul>
                        <li><a href="order.html">我的订单</a></li>
                        <li class="spacer"></li>
                        <li><a href="#">我的品优购</a><i class="fa fa-angle-down"></i></li>
                        <li class="spacer"></li>
                        <li><a href="#">品优购会员</a></li>
                        <li class="spacer"></li>
                        <li><a href="#">企业采购</a></li>
                        <li class="spacer"></li>
                        <li><a href="#">关注品优购</a><i class="fa fa-angle-down"></i></li>
                        <li class="spacer"></li>
                        <li><a href="#">客户访问</a><i class="fa fa-angle-down"></i></li>
                        <li class="spacer"></li>
                        <li><a href="#">网站导航</a><i class="fa fa-angle-down"></i></li>
                    </ul>
                </div>
            </div>
    </div>
    <!-- 顶部快捷导航 end -->
    <!-- header 开始  -->
    <header class="container">
            <!-- logo -->
            <div class="logo">
            <h1><a href="index.html" title="品优购">品优购</a></h1>
            </div>
            <!-- sk -->
            <div class="sk">
                <img src="uploads/secKill_03.png" alt="">
            </div>
            <!-- search -->
            <div class="search">
                <input type="text" class="text fn-fl" value="请搜索内容……">
                <button class="btn fn-fl">搜索</button>
            </div>
            <!-- hotwords -->
            <div class="hotwords">
                <a href="#" class="style-red">优惠购首发</a>
                <a href="#">亿元优惠</a>
                <a href="#">9.9元团购</a>
                <a href="#">每满99减30</a>
                <a href="#">办公用品</a>
                <a href="#">电脑</a>
                <a href="#">通信</a>
            </div>
            <div class="shopcar">
                <i class="fa fa-shopping-cart style-red car"></i>我的购物车<i class="fa fa-angle-right arrow"></i>
                <i class="count">80</i>
            </div>
    </header>
    <!-- header 结束  -->
    <!-- nav start -->
    <nav>
        <div class="container">
            <div class="sk-list fn-fl">
                <ul>
                    <li><a href="#">品优秒杀</a></li>
                    <li><a href="#">即将售罄</a></li>
                    <li><a href="">超值低价</a></li>
                </ul>
            </div>
            <div class="sk-con fn-fl">
                <ul>
                    <li><a href="#">女装</a></li>
                    <li><a href="#">女鞋</a></li>
                    <li><a href="#">男装</a></li>
                    <li><a href="#">男鞋</a></li>
                    <li><a href="#">母婴童装</a></li>
                    <li><a href="#">食品</a></li>
                    <li><a href="#">智能数码</a></li>
                    <li><a href="#">运动户外</a></li>
                    <li><a href="#">更多分类<i class="fa fa-angle-down"></i></a></li>
                </ul>
            </div>
        </div>
    </nav>
    <!-- nav end -->

    <!-- main 开始 -->
    <div class="sk-container container">
        <div class="sk-hd">
          <img src="uploads/bg_03.png" alt="">
        </div>
        <div class="sk-bd fn-clearfix">
            <ul>
                <li class="sk-goods border">
                    <a href="detaile.html">
                    <a href="detaile.html">
                    <a href="details.html">
                        <img src="uploads/mobile.png" alt="">
                        <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    </a>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
            </ul>
            <ul>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
            </ul>
            <ul>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
            </ul>
            <ul>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
                <li class="sk-goods">
                    <img src="uploads/mobile.png" alt="">
                    <h5 class="sk-goods-title">Apple苹果iPhoen 6s Plus(A1699)32G 黑色 移动联通电信4G手机</h5>
                    <p class="sk-goods-price">￥6088 <em>￥6988</em></p>
                    <div class="sk-goods-progress">
                        已售<i>87%</i>
                        <div class="bar">
                            <div class="bar-in"></div>
                        </div>
                        剩余<em>29</em>件
                    </div>
                    <a href="#" class="sk-goods-buy">立即抢购</a>
                </li>
            </ul>
        </div>
        <!-- 分页 start-->
        <div class="page">
            <span class="page-num">
                <a href="#" class="pn-prev">&lt;&lt;上一页</a>
                <a href="#">1</a>
                <a href="#" class="current">2</a>
                <a href="#">3</a>
                <a href="#">4</a>
                <a href="#">5</a>
                <a href="#" class="dotted">……</a>
                <a href="#" class="pn-next">下一页&gt;&gt;</a>
            </span>
            <span class="page-skip">
                &nbsp;共10页&nbsp;&nbsp;到第
                <input type="text">
                页
                <button>确定</button>
            </span>
        </div>
        <!-- 分页 end-->
    </div>
    <!-- main 结束-->   



    <!-- 底部 start -->
    <footer>
            <div class="container">
                <div class="mod-server">
                    <ul>
                        <li>
                            <i class="mod-server-icon mod-server-zheng"></i>
                            <div class="mod-server-tit">
                                <h5>正品保障</h5>
                                <p>正品保障，提供发票</p>
                            </div>
                        </li>
                        <li>
                            <i class="mod-server-icon mod-server-kuai"></i>
                            <div class="mod-server-tit">
                                <h5>急速物流</h5>
                                <p>急速物流，极速送达</p>
                            </div>
                        </li>
                        <li>
                            <i class="mod-server-icon mod-server-bao"></i>
                            <div class="mod-server-tit">
                                <h5>无忧售后</h5>
                                <p>7天无理由退换货</p>
                            </div>
                        </li>
                        <li>
                            <i class="mod-server-icon mod-server-tese"></i>
                            <div class="mod-server-tit">
                                <h5>特色服务</h5>
                                <p>私人订制家电套餐</p>
                            </div>
                        </li>
                        <li>
                            <i class="mod-server-icon mod-server-help"></i>
                            <div class="mod-server-tit">
                                <h5>帮助中心</h5>
                                <p>您的购物指南</p>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="mod-help">
                    <dl class="mod-help-item">
                        <dt>购物指南</dt>
                        <dd><a href="#">购物流程</a></dd>
                        <dd><a href="#">会员介绍</a></dd>
                        <dd><a href="#">生活旅行/团购</a></dd>
                        <dd><a href="#">常见问题</a></dd>
                        <dd><a href="#">大家电</a></dd>
                        <dd><a href="#">联系客服</a></dd>
                    </dl>
                    <dl class="mod-help-item">
                        <dt>配送方式</dt>
                        <dd><a href="#">上门自提</a></dd>
                        <dd><a href="#">211限时达</a></dd>
                        <dd><a href="#">配送服务查询</a></dd>
                        <dd><a href="#">配送费收取标准</a></dd>
                        <dd><a href="#">海外配送</a></dd>
                    </dl>
                    <dl class="mod-help-item">
                        <dt>支付方式</dt>
                        <dd><a href="#">货到付款</a></dd>
                        <dd><a href="#">在线支付</a></dd>
                        <dd><a href="#">分期付款</a></dd>
                        <dd><a href="#">邮局汇款</a></dd>
                        <dd><a href="#">公司转账</a></dd>
                    </dl>
                    <dl class="mod-help-item">
                        <dt>售后服务</dt>
                        <dd><a href="#">售后政策</a></dd>
                        <dd><a href="#">价格保护</a></dd>
                        <dd><a href="#">退款说明</a></dd>
                        <dd><a href="#">返修/退换货</a></dd>
                        <dd><a href="#">取消订单</a></dd>
                    </dl>
                    <dl class="mod-help-item">
                        <dt>特色服务</dt>
                        <dd><a href="#">夺宝岛</a></dd>
                        <dd><a href="#">DIY装机</a></dd>
                        <dd><a href="#">延保服务</a></dd>
                        <dd><a href="#">品优购E卡</a></dd>
                        <dd><a href="#">品优购通信</a></dd>
                    </dl>
                    <dl class="mod-help-item mod-help-app">
                        <dt>帮助中心</dt>
                        <dd>
                            <img src="images/wx_cz.jpg" alt="">
                            <p>品优购客户端</p>
                        </dd>
                    </dl>
                </div>
                <!-- mod_copyright -->
                <div class="mod-copyright">
                    <p class="mod-copyright-links">
                        <a href="#">关于我们</a>|
                        <a href="#">联系我们</a>|
                        <a href="#">联系客服</a>|
                        <a href="#">商家入驻</a>|
                        <a href="#">营销中心</a>|
                        <a href="#">手机品优购</a>|
                        <a href="#">友情链接</a>|
                        <a href="#">销售联盟</a>|
                        <a href="#">品优购社区</a>|
                        <a href="#">品优购公益</a>|
                        <a href="#">English&nbsp;Site</a>|
                        <a href="#">Contact&nbsp;U</a>
                    </p>
                    <p>地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：10096 电话：400-618-4000 传真：010-82935100 邮箱：zhangsan@cast.cn</p>
                    <p>京ICP 备 08001421 号 &copy;京公网安备 110108007702</p>
                </div>
            </div>
    </footer>
    <!-- 底部 end -->
</body>
</html>